<!-- 关键词拉群 -->
<template>
  <div>
    <NormalForm pageTitle="关键词拉群" :operateForm="queryForm" :formList="formList" :enumOpt="enumOpt"
      @handleQuery="handleQuery" @handleReset="handleReset" />
    <div class="g-card">
      <div class="right-btn">
        <el-button type="primary" plain @click="add">新建</el-button>
      </div>
      <!-- 表格 -->
      <div style="padding: 0px 20px 20px 20px">
        <el-table v-loading="loading" :data="tableList" style="width: 100%" height="415">
          <el-table-column type="index" width="55" align="center" label="序号" />
          <el-table-column label="任务名称" align="center" prop="" show-overflow-tooltip :width="140" />
          <el-table-column label="匹配规则" align="center" prop="" show-overflow-tooltip />
          <el-table-column label="关键词" align="center" prop="" show-overflow-tooltip />
          <el-table-column label="超级企微" align="center" prop="" show-overflow-tooltip />
          <el-table-column label="发送邀请" align="center" prop="" show-overflow-tooltip />
          <el-table-column label="状态" align="center" prop="" show-overflow-tooltip />
          <el-table-column label="创建时间" align="center" prop="" show-overflow-tooltip />
          <el-table-column label="操作" align="center" fixed="right" width="80" class-name="small-padding fixed-width">
            <template slot-scope="{ row }">
              <div class="option-span">
                <span @click="detail(row)">详情</span>
              </div>
            </template>
          </el-table-column>
        </el-table>
        <NormalPagination :currentPage="queryForm.pageNum" :pageSize="queryForm.pageSize" :total="total"
          @handleSizeChange="handleSizeChange" @handleCurrentChange="handleCurrentChange" />
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "KeywordGroup",
  data() {
    return {
      // 查询参数
      queryForm: {
        pageNum: 1,
        pageSize: 20,
      },
      formList: [
        {
          label: "任务名称",
          value: "",
          prop: "groupName",
          type: "INPUT",
          emunName: "",
        },
        {
          label: "群主",
          value: "",
          prop: "groupManager",
          type: "SELECT",
          emunName: "managerList",
        },
      ],
      // 表格参数
      tableList: [],
      total: 0,
      loading: false,
      enumOpt: {
        managerList: [],
        tagList: [],
      },
    };
  },
  created() {
    this.handleQuery();
  },
  methods: {
    add() {
      this.$router.push({
        name: "KeywordGroupAdd",
      });
    },
    detail(row) {},
    // 远程搜索任务名称 + 搜索
    handleQuery() {
      this.queryForm.pageNum = 1;
      this.queryTaskListFn();
    },
    // 查询列表
    queryTaskListFn() {
      // this.loading = true;
      let obj = {
        groupName: this.queryForm.groupName,
        groupLeaderId: this.queryForm.groupManager,
      };
      // queryTaskList(obj).then((res) => {
      //   if (res.code === 200 && res.rows.length) {
      //     this.tableList = res.rows || [];
      //     this.total = res.total || 0;
      //   }
      //   this.loading = false;
      // });
    },
    handleSizeChange(val) {
      this.queryForm.pageNum = 1;
      this.queryForm.pageSize = val;
      this.queryTaskListFn();
    },
    handleCurrentChange(val) {
      this.queryForm.pageNum = val;
      this.queryTaskListFn();
    },
    // 重置
    handleReset() {
      this.queryForm = {
        pageNum: 1,
        pageSize: 20,
      };
      this.queryTaskListFn();
    },
  },
};
</script>

<style lang="scss" scoped>
@import "@/styles/base.scss";
</style>